<div class="module-register" :class="{'module-register--xibanya':$i18n.locale === 'es'}">
    <template v-if="isLoading === true">
        <div class="m-loading-box">
            <loading></loading>
        </div>
    </template>

    <template v-if="isLoading === false">
        <web-box :title="$t('webBoxPCTitle')" :mobileTit="$t('webBoxTitle')">
            <div class="module-register">
                <validator :rules="rules" :parent="_self">
                    <form v-if="true" class="m-form-page m-form-login" name="form" action="javascript:;">
                        <div class="col-row fn-flex">
                            <label class="row-title">{{$t('common.email')}}</label>
                            <input type="text"
                                   tabindex="1"
                                   :placeholder="$t('common.pEmail')"
                                   name="email"
                                   v-model="form.email"
                                   ref="loginNum"
                                   @focus="statEmail"
                                   class="input stat-email">
                            <div class="ui-tip"></div>
                        </div>
                        <div class="col-row fn-flex">
                            <label class="row-title">{{$t('common.loginPassword')}}</label>
                            <input type="password"
                                   tabindex="2"
                                   :placeholder="$t('common.pPass')"
                                   autocomplete="off"
                                   v-model="form.setPsd"
                                   name="setPsd"
                                   ref="loginPsd"
                                   @focus="checkPsd"
                                   @blur="checkPsdBlur"
                                   class="input">
                            <div class="ui-tip"></div>
                        </div>
                        <div class="col-row fn-flex">
                            <label class="row-title">{{$t('common.confirmPwd')}}</label>
                            <input type="password"
                                   tabindex="3"
                                   :placeholder="$t('common.confirmPassRequireTipShort')"
                                   autocomplete="off"
                                   v-model="form.confirmNewPwd"
                                   name="confirmNewPwd"
                                   @focus="reCheckPsd"
                                   class="input">
                            <div class="ui-tip"></div>
                        </div>
                        <!--<div class="col-row fn-flex">-->
                            <!--<label class="row-title">{{$t('inviteCodeLabel')}}</label>-->
                            <!--<input type="text"-->
                                   <!--tabindex="4"-->
                                   <!--:placeholder="$t('placeholderInviteCode')"-->
                                   <!--name="inviteCode"-->
                                   <!--v-model="form.inviteCode"-->
                                   <!--maxlength="8"-->
                                   <!--class="input">-->
                            <!--<div class="ui-tip"></div>-->
                        <!--</div>-->
                        <!--<div class="col-row">-->
                            <!--<label class="label">-->
                                <!--<input type="checkbox"-->
                                       <!--class="check-left"-->
                                       <!--id="agree"-->
                                       <!--name="agree"-->
                                       <!--style="height: auto; vertical-align: middle"-->
                                       <!--@change="changeAgree">-->
                                <!--<span class="text" style="vertical-align: middle">{{$t('agree')}}</span>-->
                                <!--<a href="/cn/about.html#/use-terms"-->
                                   <!--v-if="lib.isMobile() === false"-->
                                   <!--class="text"-->
                                   <!--style="vertical-align: middle;" target="_blank">{{$t('term')}}</a>-->
                                <!--<a href="/cn/m_use_term.html"-->
                                   <!--v-if="lib.isMobile() === true"-->
                                   <!--class="text"-->
                                   <!--style="vertical-align: middle;">{{$t('term')}}</a>-->
                            <!--</label>-->
                        <!--</div>-->
                        <div class="col-row">
                            <button type="submit"
                                    class="ui-btn ui-btn--block  submit-btn"
                                    v-if="isRequesting === false"
                                    tabindex="5"
                                    @click="submit()">{{$t('createAccount')}}</button>
                            <!--<button type="submit"-->
                                    <!--tabindex="6"-->
                                    <!--@click="submit"-->
                                    <!--class="ui-btn ui-btn&#45;&#45;block">-->
                                <!--{{$t('createAccount')}}-->
                            <!--</button>-->
                            <button type="submit"
                                    class="ui-btn  ui-btn--block  submit-btn"
                                    disabled
                                    v-if="isRequesting === true">{{ $t('common.waiting') }}...
                            </button>
                        </div>
                        <div class="col-row fn-ta-center">
                            {{$t('haveAccount')}} <a href="javascript:;" class="link link-login" @click="goToLogin"> {{$t('common.signIn')}} </a>
                        </div>
                    </form>
                </validator>
            </div>
        </web-box>
    </template>
</div>